<template>
  <el-dialog :model-value="visible" :title="dialogTitle" width="700px" @close="handleClose">
    <el-card v-if="sealInfo" shadow="never">
      <el-descriptions :column="2" border>
        <el-descriptions-item label="编号">{{ sealInfo.number }}</el-descriptions-item>
        <el-descriptions-item label="申请部门">{{ sealInfo.deptName }}</el-descriptions-item>
        <el-descriptions-item label="使用日期">{{ sealInfo.useDate }}</el-descriptions-item>
        <el-descriptions-item label="使用类型">
          <el-tag type="primary">
            {{ getUseTypeLabel(sealInfo.useType) }}
          </el-tag>
        </el-descriptions-item>
        <el-descriptions-item label="印章类型">{{ sealInfo.sealType }}</el-descriptions-item>
        <el-descriptions-item label="申请人">{{ sealInfo.applyName }}</el-descriptions-item>
        <el-descriptions-item label="备注">{{ sealInfo.remark }}</el-descriptions-item>
        <el-descriptions-item label="状态">
          <dict-tag :options="sealStatus" :value="sealInfo.status" />
        </el-descriptions-item>
        <el-descriptions-item label="用章事由" :span="2">
          <div style="min-height: 60px; white-space: pre-line; word-break: break-all; line-height: 1.8">{{ sealInfo.sealCause }}</div>
        </el-descriptions-item>
      </el-descriptions>
      <div v-if="sealInfo.sealFiles && sealInfo.sealFiles.length" style="margin-top: 20px">
        <div class="audit-title">印章文件</div>
        <el-table :data="sealInfo.sealFiles" border style="width: 100%">
          <el-table-column prop="fileName" label="文件名" />
          <el-table-column prop="fileCount" label="份数" />
        </el-table>
      </div>
      <!-- 只读部门审核意见列表，仅董办审核时显示 -->
      <div v-if="currentAuditType === 'ceo'" style="margin-top: 24px">
        <div class="audit-title">部门审核意见</div>
        <div v-if="sealInfo.deptIdeas && sealInfo.deptIdeas.length > 0">
          <el-card
            v-for="(idea, index) in sealInfo.deptIdeas"
            :key="index"
            shadow="never"
            style="margin-bottom: 8px; background: #fafbfc; border-radius: 6px; border: 1px solid #f0f0f0"
            body-style="padding: 10px 16px;"
          >
            <div style="display: flex; justify-content: space-between; align-items: center">
              <span style="color: #409eff; font-weight: 500; font-size: 14px">{{ idea.principalName }}</span>
              <span style="color: #444; font-size: 14px">{{ idea.principalIdea }}</span>
            </div>
          </el-card>
        </div>
        <div v-else style="color: #bbb; padding: 12px 0">暂无部门审核意见</div>
      </div>
      <!-- 审核意见输入框，placeholder根据审核类型变化 -->
      <div style="margin: 24px 0 0 0">
        <el-form>
          <el-form-item :label="currentAuditType === 'ceo' ? '董办审核意见' : '部门负责人意见'">
            <el-input
              v-model="principalIdea"
              type="textarea"
              :maxlength="128"
              show-word-limit
              :rows="3"
              :placeholder="currentAuditType === 'ceo' ? '请输入董办审核意见，最多128字' : '请输入部门负责人意见，最多128字'"
              style="width: 100%"
            />
          </el-form-item>
        </el-form>
      </div>
    </el-card>
    <el-empty v-else description="暂无数据" />
    <template #footer>
      <div style="display: flex; justify-content: center; gap: 32px">
        <el-button type="danger" @click="handleReject">审核不通过</el-button>
        <el-button type="primary" @click="handleApprove">审核通过</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup lang="ts">
import { ref, watch, computed, getCurrentInstance } from 'vue';
import { getAuditInfo, auditSeal } from '@/api/general/administration/seal';
import { useUserStore } from '@/store/modules/user';

const props = defineProps({
  sealId: {
    type: [String, Number],
    default: ''
  },
  visible: Boolean,
  sealStatus: {
    type: Array,
    default: () => []
  },
  sealUseType: {
    type: Array,
    default: () => []
  },
  auditType: {
    type: String,
    default: 'dept'
  }
});
const emit = defineEmits(['update:visible', 'success']);

const sealInfo = ref<any>(null);
const principalIdea = ref('');
const userStore = useUserStore();
const { proxy } = getCurrentInstance() as any;

const currentAuditType = ref(props.auditType);

watch(
  () => props.auditType,
  (val) => {
    currentAuditType.value = val;
  }
);

const dialogTitle = computed(() => (currentAuditType.value === 'ceo' ? '董办审核' : '部门审核'));

watch(
  () => props.sealId,
  async (id) => {
    if (id) {
      const res = await getAuditInfo(id, currentAuditType.value);
      sealInfo.value = res.data;
      if (currentAuditType.value === 'ceo') {
        principalIdea.value = (res.data as any).approverIdea || '';
      } else {
        principalIdea.value = (res.data as any).principalIdea || '';
      }
    } else {
      sealInfo.value = null;
      principalIdea.value = '';
    }
  },
  { immediate: true }
);

const handleClose = () => {
  principalIdea.value = '';
  emit('update:visible', false);
};

const getUseTypeLabel = (useType: string) => {
  const dict = (props.sealUseType as any[]).find((item) => item.value == useType);
  return dict ? dict.label : useType;
};

// 供父组件调用，打开弹窗并加载数据
const openDialog = async (id: string | number, type: string = 'dept') => {
  currentAuditType.value = type;
  emit('update:visible', true);
  if (id) {
    const res = await getAuditInfo(id, type);
    sealInfo.value = res.data;
    if (type === 'ceo') {
      principalIdea.value = (res.data as any).approverIdea || '';
    } else {
      principalIdea.value = (res.data as any).principalIdea || '';
    }
  }
};

const handleApprove = async () => {
  if (!sealInfo.value) return;
  await auditSeal({
    id: sealInfo.value.id,
    principalIdea: principalIdea.value,
    status: currentAuditType.value === 'ceo' ? '2' : '1', // 董办审核通过为2，部门审核通过为1
    auditType: currentAuditType.value
  });
  if (typeof window !== 'undefined' && (window as any).$modal) {
    (window as any).$modal.msgSuccess('审核通过！');
  } else if (proxy && proxy.$modal) {
    proxy.$modal.msgSuccess('审核通过！');
  }
  emit('update:visible', false);
  emit('success');
};
const handleReject = async () => {
  if (!sealInfo.value) return;
  await auditSeal({
    id: sealInfo.value.id,
    principalIdea: principalIdea.value,
    status: currentAuditType.value === 'ceo' ? '4' : '3', // 董办审核不通过为4，部门审核不通过为3
    auditType: currentAuditType.value
  });
  if (typeof window !== 'undefined' && (window as any).$modal) {
    (window as any).$modal.msgSuccess('审核不通过！');
  } else if (proxy && proxy.$modal) {
    proxy.$modal.msgSuccess('审核不通过！');
  }
  emit('update:visible', false);
  emit('success');
};

defineExpose({ openDialog });
</script>

<style scoped>
.audit-title {
  color: #666;
  font-size: 15px;
  font-weight: bold;
  margin-bottom: 10px;
}
.seal-audit-page {
  max-width: 900px;
  margin: 0 auto;
  padding: 24px;
}
</style>
